<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
		Remove this if you use the .htaccess -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<title>my_routes</title>
		<meta name="description" content="" />
		<meta name="author" content="mODY" />
		<meta name="viewport" content="width=device-width; initial-scale=1.0" />
		<!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
		<link rel="shortcut icon" href="/favicon.ico" />
		<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
		<script type="text/javascript" src="js/libs/jquery-1.5.1.js"></script>
		<script type="text/javascript" src="js/mylibs/jquery.min.js"></script>
		<script type="text/javascript" src="js/mylibs/jquery.easing-1.3.pack.js"></script>
		<script type="text/javascript" src="js/mylibs/jquery.mousewheel-3.0.4.pack.js"></script>
		<script type="text/javascript" src="js/mylibs/jquery.fancybox-1.3.4.js"></script>
		<!--CSS -->
		<link rel="stylesheet" href="css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
	</head>
	<body>
		<div>
			<header></header>
			<div  style="border: #DDDDDD; padding: 20px; background: #E5E5E5; border-radius: 22px;">
				<table border="0" width="100%">
					<tr>
						<td align="left" valign="center"><font size="3"> <b>Available Routes</b> </font></td><td align="right"><a id="add">
						<input type="button" class="add" name="Addroute" value="Add new Route"/>
						</a></td>
					</tr>
				</table>
				<hr />
				<table>
					<tr>
						<td>
						<ul>
							<li>
								<a id="route1" >Route 1</a>
							</li>
							<li>
								<a id="route3">Route 2</a>
							</li>
							<li>
								<a id="route3">Route 3</a>
							</li>
						</ul></td>
					</tr>
				</table>
			</div>
			<br />
			<br />
			<div  style="border: #DDDDDD; padding: 20px; background: #E5E5E5; border-radius: 22px;">
				<table border="0" width="100%">
					<tr>
						<td align="left" valign="center"> <font size="3"> <b>Available Lines</b> </font> </td><td align="right">
						<a id="addLine">
						<input type="button" class="add" name="Addline" value="Add new Line"/>
						</a></td>
					</tr>
				</table>
				<hr />
				<table>
					<tr>
						<td>
						<ul>
							<li>
								<a id="line1" >Line 1</a>
							</li>
							<li>
								<a id="line3">Line 2</a>
							</li>
							<li>
								<a id="line3">Line 3</a>
							</li>
						</ul></td>
					</tr>
				</table>
			</div>
			<footer></footer>
		</div>
		<script>
			$(document).ready(function() {
			        $("#add").click(function(){
					window.parent.$.fancybox({                                                        
				                'height' : '80%',
				                'width' : '70%',
				                'modal' : false,
				                'showCloseButton' : true,
				                'href' : 'routeAddition.html',
				                'type' : 'iframe'
				        });
								
				});
			        $("#route1").click(function(){
					window.parent.$.fancybox({                                                        
				                'height' : '200%',
					        'width' : '200%',
					        'modal' : false,
					        'showCloseButton' : true,
					        'href' : 'routeDetails.html',
					        'type' : 'iframe'
				        });		
				});
				
				$("#addLine").click(function(){
					window.parent.$.fancybox({                                                        
				                'height' : '200%',
					        'width' : '200%',
					        'modal' : false,
					        'showCloseButton' : true,
					        'href' : 'newLine.html',
					        'type' : 'iframe'
				        });		
				});
			});

		</script>
	</body>
</html>
